<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>登录</title>
<style type="text/css">
	body{
		background-image: url("https://passport.baidu.com/static/passpc-account/img/reg_bg_min.jpg" );
		background-size:100% 720px;
		background-repeat: no-repeat;
		/* background-color: #B1BAC1 */
	 }
	 div{
	 	border-radius:20px;
	 	width: 350px;
	 	height: 350px;
	 	margin: 100px 700px;
	 	background-color: white;
	  }
	table{
		margin: 30px 35px;
		line-height: 10px;	
	}
	input{
		width:250px;
		height: 40px;
	
	 }
	 #i1{
	 text-align: center;
	 font-size: 15px;
	 color: white;
	 }
	 #i2{
	 	
		font-size: 15px;
	 	color: white;
	 }
	 #tr1{
	 	height: 0px;
	 	display:none;
	 	
	 }


</style>
</head>
<body>
	<div>
	<form action="/demo1" method="post">
		<table   width="280px" height="280px" cellspacing="8px" >
			 <tr>
				<td  height="30px"><input id = "i1" type="text" value="x-admin2.0登录" style="background-color: #189F92 " text-align = "center"></td>	
			</tr>
			
			 
			<tr>
				<td  height="30px"><input name="userName" type="text" placeholder="用户名"  id="d1"></td>
			</tr>
			<tr id="tr1"><td ></td></tr>
			<tr>
				<td height="30px"><input name="password" type="password" placeholder="密码" id="d2" ></td>
			</tr>
			<tr>
				<td height="30px"><input id="i2" type="submit" value="登录"  style="background-color: #189F92" ></td>
			</tr>
		</table>
		
		</form>
		<a href="./regist.html">注册</a>
	</div>	
	<script type="text/javascript">
		var d1 = document.getElementById("d1");
		var tr1 = document.getElementById("tr1");
	
		d1.onfocus = function() {
			tr1.style.display==none;
		}
		
		d1.onblur = function() {
			if(d1.value==""||d1.value==null){
				tr1.style.display==block;
				tr1.inner
			}
		}
	</script>
</body>
</html>